<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>点击事件操作</title>
	</head>
	
	<body>
		<div id="app">
			<!-- 点击事件的案例
				  1.事件绑定使用基本语法  v-on:
				  2.简化写法   v-on: 使用@符号代替
			 -->
			{{num}} <br>
			<!-- <button v-on:click="">自增</button> -->
			<button @click="addNum">自增</button>
		</div>
		
		<script src="../js/vue.js"></script>
		<script>
			/*  
				JS中的变量名称
				1. var 最常规的变量声明,没有作用域
				2. let 代替var 有作用域
				3. const 定义常量
			 */
			const app = new Vue({
				el: "#app",
				data: {
					num: 100  
				},
				methods:{
					addNum(){
						//自增
						this.num ++
					}
				}
			})
		</script>
	</body>
</html>
